﻿<UserControl x:Class="CitiSurface.AlbumControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:cs="clr-namespace:CitiSurface"
             xmlns:s="http://schemas.microsoft.com/surface/2008"
             xmlns:fluid="clr-namespace:FluidKit.Controls;assembly=FluidKit"
             mc:Ignorable="d" x:Name="root" Background="White"
             d:DesignHeight="300" d:DesignWidth="300" >
    <!-- Customized User Control for each Album when it has been dragging out from the MainBar -->
    <UserControl.Resources>
    	<ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="CitiSurfaceDictionary.xaml"/>
                <ResourceDictionary>
                    <Storyboard x:Key="ControlPanelFadein">
                        <DoubleAnimation Storyboard.TargetName="CancelButton"
                            Storyboard.TargetProperty="Opacity"
                            From="0" To="1" Duration="0:0:1"/>
                        <DoubleAnimation Storyboard.TargetName="BackButton"
                            Storyboard.TargetProperty="Opacity"
                            From="0" To="1" Duration="0:0:1"/>
                        <DoubleAnimation Storyboard.TargetName="NextButton"
                            Storyboard.TargetProperty="Opacity"
                            From="0" To="1" Duration="0:0:1"/>
                    </Storyboard>

                    <Storyboard x:Key="ControlPanelFadeout">
                        <DoubleAnimation Storyboard.TargetName="CancelButton"
                            Storyboard.TargetProperty="Opacity"
                            From="1" To="0" Duration="0:0:1"/>
                        <DoubleAnimation Storyboard.TargetName="BackButton"
                            Storyboard.TargetProperty="Opacity"
                            From="1" To="0" Duration="0:0:1"/>
                        <DoubleAnimation Storyboard.TargetName="NextButton"
                            Storyboard.TargetProperty="Opacity"
                            From="1" To="0" Duration="0:0:1"/>
                    </Storyboard>
                </ResourceDictionary>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </UserControl.Resources>
    
    <Grid>
    	<Grid.RowDefinitions>
    		<RowDefinition Height="Auto"/>
    		<RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
    	</Grid.RowDefinitions>

        <fluid:ElementFlow Grid.Row="0" Grid.RowSpan="3" x:Name="elementFlow"
                           ItemsSource="{Binding ImageSources}"
                           TiltAngle="70"
                           ItemGap="0.25"
                           FrontItemGap="0.7"
                           PopoutDistance="0"
                           ElementHeight="230"
                           Background="Black"
                           TouchDown="ElementFlowTouchDown"
                           >
            <fluid:ElementFlow.Layout>
                <fluid:CoverFlow />
            </fluid:ElementFlow.Layout>
            <fluid:ElementFlow.Camera>
                <PerspectiveCamera FieldOfView="20"
                                   Position="0,0,5"
                                   LookDirection="0,0,-5" />
            </fluid:ElementFlow.Camera>
            <fluid:ElementFlow.ItemTemplate>
                <DataTemplate>
                    <Grid Background="Black">
                        <Image Source="{Binding}" Stretch="Uniform"/>
                    </Grid>
                </DataTemplate>
            </fluid:ElementFlow.ItemTemplate>
        </fluid:ElementFlow>
        
        <cs:CitiSurfaceButton Grid.Row="0" 
                            x:Name="CancelButton"
                            Source="Resources/cancel.png" HorizontalAlignment="Right" VerticalAlignment="Top"
                            Click="CancelButtonClick" 
                            Visibility="Collapsed"/>
        
        <cs:CitiSurfaceButton Grid.Row="2"
                              x:Name="BackButton"
                              Source="Resources/back.png" HorizontalAlignment="Left" VerticalAlignment="Bottom"
                              Click="BackButtonClick"
                              Visibility="Collapsed"/>
        
        <cs:CitiSurfaceButton Grid.Row="2"
                              x:Name="NextButton"
                              Source="Resources/next.png" HorizontalAlignment="Right" VerticalAlignment="Bottom"
                              Click="NextButtonClick"
                              Visibility="Collapsed"/>
	</Grid>
</UserControl>
